<template>
	<view>
		<u-subsection :list="labelList" :current="current" :fontSize="24" mode="subsection" activeColor="#f9ae3d" @change="sectionChange">
		</u-subsection>
	</view>
</template>

<script>
	export default {
		name: "SubSection",
		data() {
			return {
				current: 0
			}
		},
		props: {
			list: {
				type: Array,
				default: function() {
					return [{
							label: "分段一",
							value: 0
						},
						{
							label: "分段二",
							value: 1
						},
						{
							label: "分段三",
							value: 2
						},
					]
				}
			}
		},
		computed: {
			labelList() {
				return this.list.map(item => item.label)
			}
		},
		methods: {
			sectionChange(index) {
				const value = this.list[index]["value"]
				this.current = index
				this.$emit("change", value)
			}
		}
	}
</script>

<style>
</style>
